<template>
	<div class="container3">
		<div class="main-c">
			<div class="main-head">
				<!-- <h2>{{ siteNamePY }}</h2> -->
			</div>
			<!-- 密码登录 -->
			<div class="login-form">
				<el-input placeholder="手机号码" prefix-icon="el-icon-user" v-model="phone"></el-input>
				<el-input @keyup.enter.native="login" placeholder="密码" type="password" prefix-icon="el-icon-lock" v-model="password"></el-input>
				<el-button type="primary" class="btn-login" @click.stop="login" v-no-more-click:3000>登录</el-button>
			</div>
			<!-- 手机登录 -->
			<!-- <div class="login-form">
				<el-input placeholder="手机号码" prefix-icon="el-icon-user" v-model="phone"></el-input>
				<el-row type="flex" class="verification-code-box">
					<el-col :span="24">
						<el-input @keyup.enter.native="login" v-model="verificationCode" placeholder="验证码"></el-input>
					</el-col>
					<el-col :span="1"></el-col>
					<el-col :span="10">
						<el-button :disabled="btnIsDisabled" type="primary" @click="getVCode()">{{VCodeText}}</el-button>
					</el-col>
				</el-row>
				<el-button type="primary" class="btn-login" @click.stop="login">登录</el-button>
			</div> -->
		</div>
	</div>
</template>

<script>
	import {login,codeLogin} from '~/api/login'
	import aes from '~/util/aes.js'
	import {validation} from './validate'
	import { getMyInfo } from "~/api/user";
	import { async } from 'q';
	import { SITE_NAME, SITE_NAME_PY } from '~/util/config'
	export default {
		head: {
			title:'登录-专利服务管理系统'
		},
		data() {
			return {
				phone: "",
				password: "",
				verificationCode: "",
				VCodeText: "获取验证码",
				btnIsDisabled: false,
				siteName: SITE_NAME,
				siteNamePY: SITE_NAME_PY,
			}
		},
		methods: {
			login() {
				let that = this;
				//效验
				let validationError = validation({
					phone: that.phone,
					password: that.password,
					// code: that.verificationCode
				})
				if (validationError === '') {
					login(that.$axios,{
						method:1,
						sourse: 'admin',
						phone: that.phone,
						password: that.password
					})
					// codeLogin(that.$axios,{
					// 	method:2,
					// 	phone: that.phone,
					// 	code: that.verificationCode
					// })
					.then(res=>{
						if(res.data.code==200){
							// if(res.data.data.user.role_id==5){//普通用户
							// 	that.$message({
							// 		message: '您没有登录权限！',
							// 		type: 'error'
							// 	});
							// }else{
								that.$cookies.remove('agent');
								that.$cookies.set('token',res.data.data.token);
								that.$store.commit("setToken",res.data.data.token);
								that.$axios.defaults.headers.common['Authorization'] = "Bearer " + res.data.data.token;
								that.$cookies.set('user',aes.Encrypt(JSON.stringify(res.data.data.user)));
								that.$store.commit("setUser",res.data.data.user)
								that.$router.push('/admin');
								// if(that.$route.query.from){
								// 	that.$router.push(that.$route.query.from);
								// }else{
								// 	that.$router.push('/admin');
								// }
							// }
						}else{
							that.$message({
								message: res.data.message,
								type: 'error'
							});
						}
					})

				} else {
					that.$message({
						message: validationError,
						type: 'warning'
					});
				}
			},
			// getVCode() {
			// 	let that = this;
			// 	if ((/^1[3456789]\d{9}$/.test(that.phone))) {
			// 		let num = 60;
			// 		that.btnIsDisabled = true;
			// 		let timer = setInterval(function() {
			// 			that.VCodeText = num + "秒后可重新发送";
			// 			num -= 1;
			// 			if (num < 0) {
			// 				that.VCodeText = "获取验证码";
			// 				that.btnIsDisabled = false;
			// 				clearInterval(timer);
			// 			}
			// 		}, 1000);
			// 		that.$axios.post('/api/captcha', {
			// 			phone: that.phone,
			// 			type: 2
			// 		}).then(res => {
			// 			if (res.data.code == 200) {
			// 				that.$message({
			// 					message: "验证码发送成功！",
			// 					type: 'success'
			// 				});
			// 			} else {
			// 				that.VCodeText = "获取验证码";
			// 				that.btnIsDisabled = false;
			// 				clearInterval(timer);
			// 				that.$message({
			// 					message: res.data.message,
			// 					type: 'error'
			// 				});
			// 			}
			// 		})
			// 	} else {
			// 		that.$message({
			// 			message: "手机号不能为空且格式不能有误",
			// 			type: 'warning'
			// 		});
			// 	}
			// }
		},
		mounted(){
			if(this.$route.query.from){
				this.$message({
					message: '您还没有登录',
					type: 'warning'
				});
			}
		}
	}
</script>


<style lang="less">
	.container3 {
		background: #fff;
		position: relative;
		z-index: 9;
		-webkit-display:flex;
		display:flex;
		-webkit-align-items:center;
		align-items:center;
		-webkit-justify-content:center;
		justify-content:center;
		margin: 0 auto;
		min-height: 100vh;
		//background-color: #f2f2f2;
		.logoImg {
			width: 200px;
			height: 60px;
			margin: 5px 0 15px 20px;box-sizing: border-box;
		}
		.box-card {
			position: absolute;
			top:0;
			width: 100%;
			height: 80px;
			.el-card__body{
				padding: 0;
			}
		}
		.main-c {
			width: 100%;
			background: white;
			margin-top: -109px;
			box-sizing: border-box;
		}

		.main-c .main-head,
		.login-form {
			width: 375px;
			margin: 0 auto;
			text-align: center;
			padding-top: 20px;
		}

		.main-head {
			height: 109px;
		}

		.main-head h2 {
			font-weight: 300;
			font-size: 30px;
			color: #000;
			margin: 0;
			padding-top: 20px;
		}

		.main-head .title-1 {
			font-weight: 300;
			color: #999;
		}

		.main-c .login-form {
			// height: 200px;
		}
		.login-form .el-input {
			margin-bottom: 15px;
		}

		.login-form .btn-login {
			width: 100%;
			margin-bottom: 30px;
		}
	}
</style>



